// pages/sorts/sorts.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 展示在右边的数组
    showList: [],
    // 当前左边选中的项的id
    currentItem: 1,
    // 一开始页面加载时替换掉左边的列表
    initList: [
      {id: 1,disc: "包包", isSelect: true},
      {id: 2,disc: "乐器", isSelect: false},
      {id: 3,disc: "家具", isSelect: false},
      {id: 4,disc: "男装", isSelect: false},
      {id: 5,disc: "女装", isSelect: false},
      {id: 6,disc: "日用", isSelect: false},
      {id: 7,disc: "小说", isSelect: false},
      {id: 8,disc: "数码", isSelect: false}, 
      {id: 9,disc: "内衣", isSelect: false},
      {id: 10,disc: "手机", isSelect: false},
      {id: 11,disc: "鞋子", isSelect: false},
    ],
    // 用于切换左边列表时将isSelect重置的数组
    sortsList: [
      {id: 1,disc: "包包", isSelect: false},
      {id: 2,disc: "乐器", isSelect: false},
      {id: 3,disc: "家具", isSelect: false},
      {id: 4,disc: "男装", isSelect: false},
      {id: 5,disc: "女装", isSelect: false},
      {id: 6,disc: "日用", isSelect: false},
      {id: 7,disc: "小说", isSelect: false},
      {id: 8,disc: "数码", isSelect: false}, 
      {id: 9,disc: "内衣", isSelect: false},
      {id: 10,disc: "手机", isSelect: false},
      {id: 11,disc: "鞋子", isSelect: false},
    ],
    // 右边要展示的宝宝数组
    bagList: [
      {id: 1,imaUrl: "../../static/sorts/包包/包包1.jpg",disc: "综包"},
      {id: 2,imaUrl: "../../static/sorts/包包/包包2.jpg",disc: "蓝包"},
      {id: 3,imaUrl: "../../static/sorts/包包/包包3.jpg",disc: "花包"},
      {id: 4,imaUrl: "../../static/sorts/包包/包包4.jpg",disc: "商务包"},
      {id: 5,imaUrl: "../../static/sorts/包包/包包5.jpg",disc: "轻奢包"},
      {id: 6,imaUrl: "../../static/sorts/包包/包包6.jpg",disc: "欧美包"},
      {id: 7,imaUrl: "../../static/sorts/包包/包包7.jpg",disc: "白包"},
      {id: 8,imaUrl: "../../static/sorts/包包/包包8.jpg",disc: "纹包"},
      {id: 9,imaUrl: "../../static/sorts/包包/包包9.jpg",disc: "纹包-Plus"},
      {id: 10,imaUrl: "../../static/sorts/包包/包包10.jpg",disc: "深棕包"},
      {id: 11,imaUrl: "../../static/sorts/包包/包包11.jpg",disc: "深红包"},
      {id: 12,imaUrl: "../../static/sorts/包包/包包12.jpg",disc: "艳红包"},
      {id: 13,imaUrl: "../../static/sorts/包包/包包13.jpg",disc: "高级包"},
      {id: 14,imaUrl: "../../static/sorts/包包/包包14.jpg",disc: "丑包"},
      {id: 15,imaUrl: "../../static/sorts/包包/包包15.jpg",disc: "丑包-Plus"},
      {id: 16,imaUrl: "../../static/sorts/包包/包包16.jpg",disc: "白领包"},
      {id: 17,imaUrl: "../../static/sorts/包包/包包17.jpg",disc: "小手包"},
      {id: 18,imaUrl: "../../static/sorts/包包/包包18.jpg",disc: "小手包-白色"},
      {id: 19,imaUrl: "../../static/sorts/包包/包包19.jpg",disc: "名媛包-综"},
      {id: 20,imaUrl: "../../static/sorts/包包/包包20.jpg",disc: "名媛包-蓝"},
      {id: 21,imaUrl: "../../static/sorts/包包/包包21.jpg",disc: "包包"},
      {id: 22,imaUrl: "../../static/sorts/包包/包包22.jpg",disc: "包包"},
    ],
    // 左边要展示的乐器数组
    insList: [
      {id: 1,imaUrl: "../../static/sorts/钢琴/钢琴1.jpg",disc: "钢琴"},
      {id: 2,imaUrl: "../../static/sorts/钢琴/钢琴2.jpg",disc: "钢琴"},
      {id: 3,imaUrl: "../../static/sorts/钢琴/钢琴3.jpg",disc: "钢琴"},
      {id: 4,imaUrl: "../../static/sorts/钢琴/钢琴4.jpg",disc: "钢琴"},
      {id: 5,imaUrl: "../../static/sorts/钢琴/钢琴5.jpg",disc: "钢琴"},
      {id: 6,imaUrl: "../../static/sorts/钢琴/钢琴6.jpg",disc: "钢琴"},
      {id: 7,imaUrl: "../../static/sorts/钢琴/钢琴7.jpg",disc: "钢琴"},
      {id: 8,imaUrl: "../../static/sorts/钢琴/钢琴8.jpg",disc: "钢琴"},
      {id: 9,imaUrl: "../../static/sorts/钢琴/钢琴9.jpg",disc: "钢琴"},
      {id: 10,imaUrl: "../../static/sorts/钢琴/钢琴10.jpg",disc: "钢琴"},
      {id: 11,imaUrl: "../../static/sorts/钢琴/钢琴11.jpg",disc: "钢琴"},
      {id: 12,imaUrl: "../../static/sorts/钢琴/钢琴12.jpg",disc: "钢琴"},
      {id: 13,imaUrl: "../../static/sorts/钢琴/钢琴13.jpg",disc: "钢琴"},
      {id: 14,imaUrl: "../../static/sorts/钢琴/钢琴14.jpg",disc: "钢琴"},
      {id: 15,imaUrl: "../../static/sorts/钢琴/钢琴15.jpg",disc: "钢琴"},
      {id: 16,imaUrl: "../../static/sorts/钢琴/钢琴16.jpg",disc: "钢琴"},
      {id: 17,imaUrl: "../../static/sorts/钢琴/钢琴17.jpg",disc: "钢琴"},
      {id: 18,imaUrl: "../../static/sorts/钢琴/钢琴18.jpg",disc: "钢琴"},
      {id: 19,imaUrl: "../../static/sorts/钢琴/钢琴19.jpg",disc: "钢琴"},
      {id: 20,imaUrl: "../../static/sorts/钢琴/钢琴20.jpg",disc: "钢琴"},
    ]
  },

  switchList: function(e) {
    // 获取当前左边点击的项的ID
    let targetId = e.currentTarget.id;
    // 用于覆盖修改左边列表项的新数组，通过sortsList数组
    let newList = [];
    // 用于覆盖修改右边商品列表的数组
    let alterList = [];

    // 判断当前id是什么，获取用于覆盖右边数据的数组
    if (targetId == 1) {
      alterList = this.data.bagList;
    } else if (targetId == 2) {
      alterList = this.data.insList;
    }
    
    // 通过map来更新左边列表的isSelect，将列表中id与点击id相同的数组的isSelect置为true
    newList = this.data.sortsList.map(item => {
      if (item.id == targetId) {
        return {
          id: item.id,
          disc: item.disc,
          isSelect: true,
        }
      } else {
        return {
          id: item.id,
          disc: item.disc,
          isSelect: false,
        }
      }
    })

    // 更换左边列表与右边列表
    this.setData({
      sortsList: newList,
    })
    this.setData({
      showList: alterList
    })
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    this.setData({
      currentItem: 1,
      sortsList: this.data.initList,
      showList: this.data.bagList,
    })
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
  
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})